import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:sgy_flutter/gen/assets.gen.dart';
import 'package:sgy_flutter/widget/loading_page.dart';
import 'package:sgy_flutter/widget/sgy_scaffold.dart';
import 'package:sgy_flutter/widget/switch_x.dart';

import 'logic.dart';

class DeviceSettingPage extends StatefulWidget {
  const DeviceSettingPage({Key? key}) : super(key: key);

  @override
  State<DeviceSettingPage> createState() => _DeviceSettingPageState();
}

class _DeviceSettingPageState extends State<DeviceSettingPage> {
  final logic = Get.put(DeviceSettingLogic());
  final double height = 30;

  @override
  Widget build(BuildContext context) {
    return SgyScaffold(
      title: "踏频检测设置".tr,
      child: Obx(()=>LoadingPage(
        loading: logic.loading.value,
        child: Column(
          children: [
            Text(
              "踏频检测方式".tr,
              style: TextStyle(
                  fontSize: 16,
                  color: Colors.black,
                  fontWeight: FontWeight.bold),
            ).marginOnly(top: 20),
            Visibility(visible: logic.showLeft.value, child: _buildLeft().marginOnly(left: 28, top: 20)),
            Visibility(visible: logic.showRight.value, child: _buildRight().marginOnly(left: 28, top: 20)),
            Text.rich(TextSpan(children: [
              WidgetSpan(
                  child: Assets.image.iconWarning
                      .image(width: 16, height: 16)
                      .marginOnly(top: 0, right: 4)),
              TextSpan(
                  text: "如选择陀螺仪，续航将减少30%。".tr,
                  style: TextStyle(
                      fontWeight: FontWeight.normal,
                      fontSize: 15,
                      color: Color(0xff7a7a7a))),
            ])).marginOnly(top: 40, left: 28, right: 28),
          ],
        ),
      )),
    );
  }

  Widget _buildLeft() {
    return Row(
      children: [
        Column(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Text(
                "L",
                style: TextStyle(fontSize: 15, color: Colors.black),
              ),
            ),
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Text(
                "加速度计".tr,
                style: TextStyle(fontSize: 15, color: Colors.black),
              ),
            ),
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Text(
                "陀螺仪".tr,
                style: TextStyle(fontSize: 15, color: Colors.black),
              ),
            )
          ],
        ).marginOnly(right: 16),
        Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Container(
              alignment: Alignment.centerLeft,
              height: height,
            ),
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Obx(() => SwitchX(
                    future: () => logic.changeLeftSensorType(1),
                    value: logic.leftSensorType.value == 1,
                    onTap: (value) => {},
                    width: 62,
                    height: 20,
                  )),
            ),
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Obx(() => SwitchX(
                    future: () => logic.changeLeftSensorType(2),
                    value: logic.leftSensorType.value == 2,
                    onTap: (value) => {},
                    width: 62,
                    height: 20,
                  )),
            ),
          ],
        ),
      ],
    );
  }

  Widget _buildRight() {
    return Row(
      children: [
        Column(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Text(
                "R",
                style: TextStyle(fontSize: 15, color: Colors.black),
              ),
            ),
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Text(
                "加速度计".tr,
                style: TextStyle(fontSize: 15, color: Colors.black),
              ),
            ),
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Text(
                "陀螺仪".tr,
                style: TextStyle(fontSize: 15, color: Colors.black),
              ),
            )
          ],
        ).marginOnly(right: 16),
        Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Container(
              alignment: Alignment.centerLeft,
              height: height,
            ),
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Obx(() => SwitchX(
                    future: () => logic.changeRightSensorType(1),
                    value: logic.rightSensorType.value == 1,
                    onTap: (value) => {},
                    width: 62,
                    height: 20,
                  )),
            ),
            Container(
              alignment: Alignment.centerLeft,
              height: height,
              child: Obx(() => SwitchX(
                    future: () => logic.changeRightSensorType(2),
                    value: logic.rightSensorType.value == 2,
                    onTap: (value) => {},
                    width: 62,
                    height: 20,
                  )),
            ),
          ],
        ),
      ],
    );
  }

  @override
  void dispose() {
    Get.delete<DeviceSettingLogic>();
    super.dispose();
  }
}
